<!--
 * @Descripttion: 库存查询列表
 * @version:
 * @Author: cxguo
 * @Date: 2019-08-02 15:03:05
 * @LastEditors  : cxguo
 * @LastEditTime : 2019-12-30 17:11:19
 -->
<template>
  <div class="tab">
    <ul class="clearfix">
      <li v-for="(item,index) in texts" :key="index">
        <a :class="{current:(currentIndex === index)}" @click="btnClick(index)">{{ item }}</a>
      </li>
      <li>
        <el-popover
          placement="top-start"
          trigger="hover"
        >
          <el-date-picker
            v-model="rangeDate"
            type="daterange"
            range-separator="至"
            start-placeholder="开始日期"
            end-placeholder="结束日期"
            value-format="yyyy-MM-dd"
            @change="onDateChange"
          />
          <a slot="reference">其他时间</a>
        </el-popover>
      </li>
    </ul>
  </div>
</template>
<script>
import { oftenuse } from '@/libs/mixins'

export default {
  name: 'StockList',
  mixins: [oftenuse],
  props: {
    texts: {
      type: Array,
      default: () => { return [] }
    }
  },
  data() {
    return {
      currentIndex: 0,
      rangeDate: null
    }
  },
  watch: {
  },
  created() {
  },
  methods: {
    btnClick(index) {
      this.currentIndex = index
      this.$emit('on-click', index)
    },
    onDateChange(data) {
      this.$emit('on-date-range', data)
    }
  }
}
</script>
<style scoped>

</style>
